﻿@page "/ProfileMenu"

@using FluentUI.Demo.Shared.Pages.ProfileMenu.Examples

<PageTitle>@App.PageTitle("ProfileMenu")</PageTitle>

<h1>ProfileMenu</h1>

<p>
    A "User Profile Menu" is a component commonly found on websites or applications.
    It typically appears in the top-right corner of a web page and provides options related to
    the user's account. Within this menu, users can access features such as viewing their account details,
    adjusting settings, and logging out. It serves as a convenient hub for managing account-related actions.
</p>

<DemoSection Title="Default" Component="typeof(ProfileMenuDefault)"></DemoSection>

<DemoSection Title="Customized" Component="typeof(ProfileMenuCustomized)"></DemoSection>

<h2 id="documentation">Documentation</h2>

<p>
    Depending on how your CSS styles are configured (e.g. whether <code>body</code> contains an <code>overflow</code> or not),
    the <b>ProfileMenu</b> may be displayed with a flicking effect when placed at the top right or top left of the screen.
    To avoid this, you can use the <code>TopCorner="true"</code> property, which forces the positioning of the popup.
</p>

<ApiDocumentation Component="typeof(FluentProfileMenu)" />
